<template>
	<view class="index_wrapper">
		<view class="index_header" v-if='show'>
			<v-header :titleName='title' :showTemp='show' />
		</view>
		<view v-else :showTemp='show' class="index_header_white" :style="{height: headTop + 'px'}">
			<v-header :titleName='title' :textColor="'#666'" />
		</view>
		<!-- <view class="content" :style="{ paddingTop: phoneHeight + 'px', backgroundImage: `url(${imgBasePath}/statics/std/static/my_top.png)` }"> -->
		<view class="content" :style="{ paddingTop: phoneHeight + 'px', backgroundImage: `url(${weatherBg})` }">
			<view class="headImg"></view>
			<view class="index_tit">
				<view class="tit_lf">
					<image class="tit_lf_top" :src="`${imgBasePath}/statics/std/static/new/index_tit.png`"></image>
					<view class="tit_lf_bot" @click.stop="handleGoNotice(gailanUrl)">
						<text>生态岛概览</text>
						<image :src="`${imgBasePath}/statics/std/static/new/go_green.png`"></image>
					</view>
				</view>
				<view class="tit_rt">
					<image class="tit_rt_top" :src="weatherImg"></image>
					<view class="tit_rt_bot">
						<text>{{weatherTxt}}</text>
						<text>{{weatherTemp}}</text>
					</view>
				</view>
			</view>
			<view class="notices">
				<img :src="`${imgBasePath}/statics/std/static/new/notice.png`" alt="">
				<swiper v-if="notices.item.length > 0" class="notice_swiper" :vertical="true" :indicator-dots="false"
					:autoplay="true" :interval="5000" :duration="1000" circular='true'>
					<swiper-item class="notice_swiper-item" v-for="(item, index) in notices.item" :key="index"
						@click="handleGoNotice(item.linkUrl)">
						<text>{{item.title}}</text>
					</swiper-item>
				</swiper>
				<text v-else>暂无公告</text>

				<!-- <img class="go" :src="process.env.VUE_APP_BASEURL_IMG_API + '/statics/std/static/go_blue.png'" alt="" -->
				<img class="go" :src="`${imgBasePath}/statics/std/static/new/arr_green.png`" alt=""
					@click="handleGoNotice(notices.visitPath)">
			</view>
			<!-- <view class="top_swiper">
				<swiper class="swiper" :indicator-dots="false" :autoplay="true" :interval="2500" :duration="1000"
					indicator-color="rgba(255, 90, 95,0.3)" indicator-active-color="rgba(255, 90, 95,0.9)"
					@change="changeTop" circular='true'>
					<swiper-item v-for="(item, index) in swiperTopList.item" :key="index">
						<view class="swiper-item" @click="handleToDetail(item)">
							<image :src="imgBasePath + item.imgPath"></image>
						</view>
					</swiper-item>
				</swiper>
				<view class="dots">
					<view :class="topCurrent == index ? 'dot_item_active' : 'dot_item'" :key="index"
						v-for="(item, index) in swiperTopList.item"></view>
				</view>
			</view> -->

			<view class="jg">
				<view class="jg_item" v-for="(item, index) in jgList" :key="index" @click="hangleJG(item)">
					<img :src="item.src" alt="">
					<text>{{item.title}}</text>
				</view>
			</view>
			<view class="subBan">
				<view class="sub_lt" @click.stop="handleGoNotice(playRoute.visitPath)">
					<view class="sub_lt_bg" :style="{backgroundImage: `url(${imgBasePath}/statics/std/static/new/sub_1.png)`}">
						<view class="sub_lt_bg_top">
							<image :src="`${imgBasePath}/statics/std/static/new/sub_1_tit.png`"></image>
							<image :src="`${imgBasePath}/statics/std/static/new/sub_go.png`"></image>
						</view>
						<text>生态岛，放肆玩！</text>
						<!-- <text class="title">游玩路线推荐</text>
						<img :src="`${imgBasePath}/statics/std/static/go_b_blue.png`" alt=""> -->
					</view>
				</view>
				<view class="sub_rt">
					<view class="rt_top" @click.stop="handleGoNotice(playStrategy.visitPath)">
						<view class="rt_top_bg" :style="{backgroundImage: `url(${imgBasePath}/statics/std/static/new/sub_2.png)`}">
							<view class="rt_top_bg_top">
								<image :src="`${imgBasePath}/statics/std/static/new/sub_2_tit.png`"></image>
								<image :src="`${imgBasePath}/statics/std/static/new/sub_go.png`"></image>
							</view>
							<text>官方游玩推荐</text>
						</view>

					</view>
					<view class="rt_bot" @click.stop="handleGoNotice(culture.visitPath)">
						<view class="rt_bot_bg" :style="{backgroundImage: `url(${imgBasePath}/statics/std/static/new/sub_3.png)`}">
							<view class="rt_bot_bg_top">
								<image :src="`${imgBasePath}/statics/std/static/new/sub_3_tit.png`"></image>
								<image :src="`${imgBasePath}/statics/std/static/new/sub_go.png`"></image>
							</view>
							<text>官方游玩推荐</text>
						</view>
					</view>
				</view>
			</view>
			<view class="hot_act" :style="{marginTop: '24rpx'}">
				<!-- <view class="act_top">
					<text class="top_lf" :style="{backgroundImage: `url(${imgBasePath}/statics/std/static/my_icon7.png)`}">热门景点</text>
					<view class="top_rt" @click="handleGoNotice(hotPlace.visitPath)">
						<text>全部</text>
						<img :src="`${imgBasePath}/statics/std/static/go.png`" alt="">
					</view>
				</view> -->
				<swiper class="spot_swiper" :indicator-dots="false" :autoplay="false" :interval="5000" :duration="1000"
					indicator-color="rgba(255, 90, 95,0.3)" indicator-active-color="rgba(255, 90, 95,0.9)"
					next-margin="24rpx" previous-margin="24rpx" circular='true'>
					<swiper-item v-for="(item, index) in hotPlay.item" :key="index">
						<view class="spot_swiper-item" @click.stop="handleToDetail(item)">
							<image :src="imgBasePath + item.imgPath"></image>
							<view class="spot_intr" >
								<view class="intr_lf">
									<text class="intr_lf_top">{{item.title}}</text>
									<view class="intr_lf_bot" @click.stop="handleToDetail(item)">
										<text>活动详情</text>
										<image :src="`${imgBasePath}/statics/std/static/new/act_go.png`"></image>
									</view>
								</view>
								<view class="intr_rt" @click.stop="handleGoNotice(hotPlay.visitPath)">
									<view>热门活动</view>
								</view>
							</view>
						</view>
					</swiper-item>
				</swiper>
			</view>
			<view class="hot_act" :style="{marginBottom: '64rpx', boxSizing: 'border-box', padding: '0 32rpx'}">
				<view class="act_top">
					<!-- <text class="top_lf" :style="{backgroundImage: `url(${imgBasePath}/statics/std/static/my_icon7.png)`}">热门景点</text> -->
					<text class="top_lf" >热门景点</text>
					<view class="top_rt" @click="handleGoNotice(hotPlace.visitPath)">
						<text>全部</text>
						<!-- <img :src="`${imgBasePath}/statics/std/static/go.png`" alt=""> -->
						<img :src="`${imgBasePath}/statics/std/static/new/arr_green.png`" alt="">
						
					</view>
				</view>
				<swiper class="act_swiper" :indicator-dots="false" :autoplay="false" :duration="1000"
					indicator-color="rgba(255, 90, 95,0.3)" indicator-active-color="rgba(255, 90, 95,0.9)"
					@change="changeAct" next-margin="22rpx" circular='true'>
					<swiper-item v-for="(item, index) in hotPlace.item" :key="index">
						<view class="act_swiper-item" @click="handleToDetail(item)">
							<image :src="imgBasePath + item.imgPath"></image>
							<view class="act_intr" >
								<view class="intr_lf">
									<text class="intr_lf_top">{{item.title}}</text>
									<view class="intr_lf_bot" @click.stop="handleToDetail(item)">
										<image :src='`${imgBasePath}/statics/std/static/loc.png`'>
										<text>{{item.dis}}</text>
									</view>
								</view>
							</view>
						</view>
					</swiper-item>
				</swiper>
				<!-- <view class="act_dots">
					<view :class="actCurrent == index ? 'dot_item_active' : 'dot_item'" :key="index"
						v-for="(item, index) in activeList.item"></view>
				</view> -->
			</view>
			<view class="tabConWrapNo" :style="{height: (windowHeight - headTop) + 'px'}">
				<view class="tab">
					<v-tabs :tabs="tabs" @changeType="getList" :showMore="true" @more="goMore" :selected='selTab'
						:live='true' />
				</view>
				<!-- <view class="tabCon" v-if="subTabs.length"> -->
				<view class="tabCon" :style="{height: subTabH + 'px'}" v-if="subTabs.length">
					<view class="sub">
						<view :class="subTabsActId == item.label ? 'item_act' : 'item'" v-for="(item, index) in subTabs"
							:key="index" @click="getApplet(item.label)">
							{{item.text}}
						</view>
					</view>
				</view>
				<view class="page_wrap" :style="{overflow: posTab ? 'scroll' : 'hidden', height: (windowHeight - headTop - tabH - subTabH) + 'px'}">
					<view class="page" v-if='leftList.length' :style="{overflow: posTab ? 'scroll' : 'hidden', height: (windowHeight - headTop - tabH - subTabH) + 'px'}">
						<view class="left" ref="left">
							<view v-for="(item,i) in leftList" :key="i" @click='goDetail(item)'>
								<view v-if="item.fileType == 0">
									<view class="mar_bot24" v-if='item.imgPath'>
										<image class="image" :src="imgBasePath + item.imgPath" mode="widthFix"></image>
										<view
											:class="['title', item.tabType == '1' || item.tabType == '2' ? '' : 'mar_bot48']">
											{{item.title}}</view>
										<view class="per" v-if="item.tabType == '1' || item.tabType == '2'">
											<view class="per_lf">
												<img :src="imgBasePath + item.avatar" alt="" v-if="item.avatar">
												<text
													:class="item.tabType == '1' ? 'zx_t' : ''">{{item.nickName || ''}}</text>
											</view>
											<view class="per_rt">
												<img :src="`${imgBasePath}/statics/std/static/eye.png`" alt="">
												<text>{{item.viewNum || 0}}</text>
											</view>
										</view>
									</view>
									<view class="no_img" v-if='!item.imgPath'>
										<text class="zx">
											{{item.title}}
										</text>
										<view class="per" v-if="item.tabType == '1' || item.tabType == '2'">
											<view class="per_lf">
												<img :src="imgBasePath + item.avatar" alt="" v-if="item.avatar">
												<text
													:class="item.tabType == '1' ? 'zx_t' : ''">{{item.nickName || ''}}</text>
											</view>
											<view class="per_rt">
												<img :src="`${imgBasePath}/statics/std/static/eye.png`" alt="">
												<text>{{item.viewNum || 0}}</text>
											</view>
										</view>
									</view>
								</view>
								<!-- <view class="video_wrap" v-if="item.fileType == 1">
									<image class="play" :src="`${imgBasePath}/statics/std/static/bofang.png`"
										mode=""></image>
									<video class="video" :show-fullscreen-btn="false" :show-play-btn="false"
										:show-center-play-btn="false" :src="imgBasePath + item.imgPath"></video>
									<view class="video_det">
										<view class="video_loc">
											<view class="video_loc_wrap">
												<image :src='`${imgBasePath}/statics/std/static/loc.png`'>
												</image>
												<text>{{item.placeName || item.addr}}</text>
											</view>
										</view>

										<view class="video_per">
											<view class="video_per_lf">
												<img :src="imgBasePath + item.avatar" alt="" v-if="item.avatar">
												<text>{{item.nickName || ''}}</text>
											</view>
											<view class="video_per_rt">
												<img :src="`${imgBasePath}/statics/std/static/eye_gray.png`" alt="">
												<text>{{item.viewNum || 0}}</text>
											</view>
										</view>
									</view>

								</view> -->

							</view>
						</view>
						<view class="right" ref="right">
							<view v-for="(item,i) in rightList" :key="i" @click='goDetail(item)'>
								<view v-if="item.fileType == 0">
									<view class="mar_bot24" v-if='item.imgPath'>
										<image class="image" :src="imgBasePath + item.imgPath" mode="widthFix"></image>
										<view
											:class="['title', item.tabType == '1' || item.tabType == '2' ? '' : 'mar_bot48']">
											{{item.title}}</view>
										<view class="per" v-if="item.tabType == '1' || item.tabType == '2'">
											<view class="per_lf">
												<img :src="imgBasePath + item.avatar" alt="" v-if="item.avatar">
												<text
													:class="item.tabType == '1' ? 'zx_t' : ''">{{item.nickName || ''}}</text>
											</view>
											<view class="per_rt">
												<!-- 												<img :src="`${imgBasePath}/statics/std/static/eye.png`" alt="">
												<text>{{item.viewNum || 0}}</text> -->
											</view>
										</view>
									</view>
									<view class="no_img" v-if='!item.imgPath'>
										<text class="zx">
											{{item.title}}
										</text>
										<view class="per" v-if="item.tabType == '1' || item.tabType == '2'">
											<view class="per_lf">
												<img :src="imgBasePath + item.avatar" alt="" v-if="item.avatar">
												<text
													:class="item.tabType == '1' ? 'zx_t' : ''">{{item.nickName || ''}}</text>
											</view>
											<view class="per_rt">
												<img :src="`${imgBasePath}/statics/std/static/eye.png`" alt="">
												<text>{{item.viewNum || 0}}</text>
											</view>
										</view>
									</view>
								</view>
								<!-- <view class="video_wrap" v-if="item.fileType == 1">
									<image class="play" :src="`${imgBasePath}/statics/std/static/bofang.png`"
										mode=""></image>
									<video class="video" :show-fullscreen-btn="false" :show-play-btn="false"
										:show-center-play-btn="false" :src="imgBasePath + item.imgPath"></video>
									<view class="video_det">
										<view class="video_loc">
											<view class="video_loc_wrap">
												<image :src='`${imgBasePath}/statics/std/static/loc.png`'>
												</image>
												<text>{{item.placeName || item.addr}}</text>
											</view>
										</view>
								
										<view class="video_per">
											<view class="video_per_lf">
												<img :src="imgBasePath + item.avatar" alt="" v-if="item.avatar">
												<text>{{item.nickName || ''}}</text>
											</view>
											<view class="video_per_rt">
												<img :src="`${imgBasePath}/statics/std/static/eye_gray.png`" alt="">
												<text>{{item.viewNum || 0}}</text>
											</view>
										</view>
									</view>
								
								</view> -->
							</view>
						</view>
					</view>
					<view class="noData" v-else>
						<image :src="`${imgBasePath}/statics/std/static/noData.png`"></image>
						<text>暂无数据</text>
					</view>
				</view>
			</view>
		</view>

		<!-- <view @click="handleGoNotice('/page_my/ecard/index')">跳转到人脸识别页面</view> -->


		<view class="ad_wrap" v-if="showAd">
			<view class="ad_img">
				<image :src='imgBasePath + adItem.item[0].imgPath' @click="handleGoNotice(adItem.item[0].linkUrl)">
				</image>
			</view>
			<view @click="closeAd" class="close">
				<image :src='`${imgBasePath}/statics/std/static/delete2.png`'></image>
			</view>
		</view>
	</view>
</template>

<script>
	import mpHtml from 'mp-html/dist/uni-app/components/mp-html/mp-html'
	import vHeader from '@/components/weaheader.vue'
	import vTabs from '@/components/tabs.vue'
	import {
		mapMutations,
		mapGetters
	} from "vuex";
	import store, {
		SET_SAFEAREA_BOTTOM,
		GET_SHOW_AD,
		SET_SHOW_AD
	} from "@/store/index.js";
	import {
		requestGet
	} from '@/utils/request.js'
	import {
		weatherList
	} from "@/utils/constant.js";
	import {currentPosition, distance} from '@/utils/index.js';
	var amapFile = require('@/utils/amap-wx.130.js');
	let img_api = process.env.VUE_APP_BASEURL_IMG_API;
  const port_api = process.env.VUE_APP_BASEURL_API;
	export default {
		data() {
			return {
				title: '首页',
				html: '<div>Hello World!</div>',
				subTabs: [],
				images: [],
				leftList: [], //左边列图片
				rightList: [], //右边列图片
				leftHeight: 0, //左边列高度
				rightHeight: 0, //右边列高度
				columnWidth: 0, //列宽度
				hasMore: true,
				swiperTopList: [],
				topCurrent: 0,
				jgList: [
					{
						title: '门票',
						src: '../../static/new/jg2.png',
						openType: 'webview',
						url: 'http://weixin.qq.com/r/4BFkfGvESDY3rS8f90Ty'
					},
					// {
					// 	title: '门票',
					// 	src: `../../static/new/jg2.png`,
					// 	openType: 'navigate',
					// 	url: '/page_index/ticket/list'
					// },
					{
						title: '餐饮',
						src: `../../static/new/jg1.png`,
						openType: 'navigate',
						url: '/page_index/restaurant/list'
					},
					{
						title: '酒店',
						src: `../../static/new/jg3.png`,
						openType: 'navigate',
						url: '/page_index/hotel/list'
					},
					{
						title: '文创',
						src: `../../static/new/jg4.png`,
						openType: 'switchTab',
						url: '/pages/mall/index'
					},
				],
				activeList: [],
				actCurrent: 0,
				spotList: [],
				notices: {},
				tabsTop: 0,
				phoneHeight: 0,
				headTop: 0,
				show: true,
				posTab: false,
				tabs: [],
				selTab: '',
				pages: {
					pageNum: 1,
					pageSize: 10,
				},
				texts: [],
				tabAct: '',
				subTabsActId: '',
				imgBasePath: img_api,
				TabHeight: 0,
				windowHeight: 0,
				adItem: {},
				tabH: 0,
				subTabH: 0,
				isIOS: false,
				playRoute: {},
				playStrategy: {},
				culture: {},
				hotPlay: {},
				hotPlace: {},
				nowGet: null,
				portApi: port_api ,
				weatherTemp: '',
				weatherTxt: '',
				weatherImg: '',
				weatherBg: '',
				gailanUrl: '',
				myPosition: {}
			};
		},
		components: {
			vHeader,
			mpHtml,
			vTabs
		},
		onLoad() {

		},
		onShow() {
			this.getWeather()
		},
		mounted() {
			uni.getSystemInfo({
				success: (res) => {
					this.columnWidth = res.windowWidth * 0.48
					this.setWaterFallLayout()
				}
			})
			console.log('获取安卓还是ios', uni.getSystemInfoSync().platform)
			if (uni.getSystemInfoSync().platform == 'ios') {
				this.isIOS = true
			}
			let safeArea = uni.getSystemInfoSync().safeArea;
			let screenHeight = uni.getSystemInfoSync().screenHeight;
			let safeAreaBottom = screenHeight - safeArea.bottom;
			this.SET_SAFEAREA_BOTTOM(safeAreaBottom)
			this.getTabs()
			this.getContent()

			this.getTabsTop((num) => {
				console.log('number', num)
				this.tabsTop = num
			})
			// this.getHeadTop((num) => {
			// 	this.headTop = (num + 44) + 'px'
			// })

			this.getTabH()

			this.getPhoneHeight()
			
			this.getCurrentPos()

			console.log('显示广告', this.showAd)

		},
		computed: {
			...mapGetters({
				showAd: [GET_SHOW_AD]
			}),
			placeDis() {
				if(this.myPosition.latitude && this.myPosition.longitude && this.hotPlace.item && this.hotPlace.item.length){
					this.hotPlace.item.map(val => {
						distance(this.myPosition.latitude, this.myPosition.longitude,val.latitude,val.longitude).then(distance => {
						  console.log("distance========", distance)
						  Object.assign(val, {dis: Number(distance) > 1000 ? (Number(distance)/1000).toFixed(1) + 'km' : distance + 'm'})
						}).catch(err => {
						  console.log("distance========err", err)
						  Object.assign(val, {dis: '暂未获得位置信息'})
						})
					})
				  
				}
			}
		},
		watch: {
			showAd: {
				handler(value) {
					if (!value) {
						console.log('显示广告', value)
						uni.showTabBar()
					}
				},
				immediate: true,
			},
			phoneHeight: {
				handler(value) {
					if (!!value) {
						this.getHeadTop((num) => {
							this.headTop = num + value
						})
					}
				}
			}
		},
		methods: {
			...mapMutations([SET_SAFEAREA_BOTTOM, SET_SHOW_AD]),
			closeAd() {
				this.SET_SHOW_AD(false)
			},
			getWeather() {
				let that = this
				var myAmapFun = new amapFile.AMapWX({
					key: 'df436f05cea4704b8ceb44a890104987'
				})
				myAmapFun.getWeather({
					city: '石家庄',
					success: function(data) {
						//成功回调
						that.weatherTemp = data.temperature.data + '℃'
						that.weatherTxt = data.weather.data
						that.weatherBg = data.weather.data == '晴' || data.weather.data == '多云' ? `${that.imgBasePath}/statics/std/static/new/index_bg1.jpg` : `${that.imgBasePath}/statics/std/static/new/index_bg2.jpg`
						that.weatherImg = weatherList.find(item => item.label === data.weather.data).image
						console.log('天气图片', data.weather.data, that.weatherImg)
					},
					fail: function(info) {
						//失败回调
						console.log(info)
					}
				})
			},
			getTabs() {
				requestGet('/home/tab/list', {}, '/baseplatform').then(res => {
					if (res.code === 200) {
						const repStr = JSON.parse(JSON.stringify(res.data).replace(new RegExp('id', 'g'), 'label')
							.replace(new RegExp('tabName', 'g'), 'text'))
						this.tabs = repStr
						this.selTab = repStr[0].label
					}
				}).catch((err) => console.log('错误了', err))
			},
			getPhoneHeight() {
				let that = this;
				uni.getSystemInfo({
					success: function(res) {
						that.windowHeight = res.windowHeight;
						that.phoneHeight = res.statusBarHeight;
						console.log("this.phoneHeight", that.phoneHeight)
					},
				});
			},
			getTabH() {
				let that = this
				const query = wx.createSelectorQuery()
				query.select('.tab').boundingClientRect()
				query.selectViewport().scrollOffset();
				query.exec(function(res) {
					// cb(res[0].height)
					console.log('that.tabH', res[0].height)
					that.tabH = res[0].height
				});
			},
			getSubTabH() {
				let that = this
				const query = wx.createSelectorQuery()
				query.select('.sub').boundingClientRect()
				query.selectViewport().scrollOffset();
				query.exec(function(res) {
					// cb(res[0].height)
					that.subTabH = res[0].height + 12
				});
			},
			getHeadTop(cb) {
				const query = wx.createSelectorQuery()
				query.select('.index_header').boundingClientRect()
				query.selectViewport().scrollOffset();
				query.exec(function(res) {
					console.log('高度3333', res)
					cb(res[0].height || 0)
				});
			},
			getTabHeight(cb) {
				const query = wx.createSelectorQuery()
				query.select('.index_header').boundingClientRect()
				query.selectViewport().scrollOffset();
				query.exec(function(res) {
					console.log('高度22222', res)
					cb(res[0].height)
				});
			},
			getTabsTop(cb) {
				const query = wx.createSelectorQuery()
				query.select('.tab').boundingClientRect()
				query.selectViewport().scrollOffset();
				query.exec(function(res) {
					cb(res[0].top)
				});
			},
			onPageScroll(e) {
				if (e.scrollTop > 0) {
					this.show = false
				} else {
					this.show = true
				}
				if (this.isIOS) {
					console.log('this isIOS')
					if (e.scrollTop >= this.tabsTop - this.phoneHeight) {
						this.posTab = true
					} else if (e.scrollTop < this.tabsTop - this.phoneHeight) {
						this.posTab = false
					}
				} else {
					// if (e.scrollTop >= this.tabsTop - this.phoneHeight) {
					// 	this.posTab = true
					// } else if (e.scrollTop < this.tabsTop - this.phoneHeight) {
					// 	this.posTab = false
					// }
					console.log('this.headTop', this.headTop)
					if (e.scrollTop >= this.tabsTop - this.headTop) {
						this.posTab = true
					} else if (e.scrollTop < this.tabsTop - this.headTop) {
						this.posTab = false
					}
				}

			},
			async getCurrentPos(){
			   try {
			     this.myPosition = await currentPosition();
			   } catch (error) {
			     console.log('定位失败:', error);
			     return 
			   }
			},
			getContent() {
				requestGet('/home/elements', null, '/baseplatform').then(res => {
					if (res.code === 200) {
						this.notices = res.notice
						this.swiperTopList = res.topCarousel
						this.activeList = res.hotPlay
						this.spotList = res.hotPlace
						this.adItem = res.popNotice
						this.playRoute = res.playRoute
						this.playStrategy = res.playStrategy
						this.culture = res.culture
						this.hotPlay = res.hotPlay
						this.hotPlace = res.hotPlace
						if (this.adItem.item && this.adItem.item[0] && this.adItem.item[0].imgPath && this.adItem.item[0].imgPath != '') {
							this.SET_SHOW_AD(true);
						} else {
							this.SET_SHOW_AD(false);
						}
						
						if (res.topCarousel.item.length) {
							if (res.topCarousel.item[0].linkUrl) {
								this.gailanUrl = res.topCarousel.item[0].linkUrl
							} else {
								if (res.topCarousel.item[0].contenId) {
									this.gailanUrl = res.topCarousel.contentPath + "?id=" + res.topCarousel.item[0].contenId
								}
							}
						} 
					} else {
						this.SET_SHOW_AD(false);
					}
				}).catch((err) => console.log('错误了', err))

			},
			getApplet(type) {
				// this.subTabsActId = type
				requestGet('/applet/notes/list', {
					...this.pages,
					// typeId: type,
					status: 1
				}, '/baseplatform').then(res => {
					if (res.code === 200) {
						this.$nextTick(() => {
							this.texts = res.rows
							console.log('获取了游记', this.texts)
							this.setWaterFallLayout(res.rows)
						})
					}
				}).catch((err) => console.log('错误了', err))
			},
			getTexts(type, sub) {
				console.log('开始请求新的')
				this.subTabH = 0
				this.texts = []
				this.leftList = []
				this.rightList = []
				this.leftHeight = 0
				this.rightHeight = 0
				this.subTabsActId = ''
				if (this.tabs.find(item => item.label == type) && this.tabs.find(item => item.label == type).children) {
					console.log('找到相同的了', this.tabs.find(item => item.label == type))
					this.subTabs = this.tabs.find(item => item.label == type)?.children
					console.log("是走到这里了")
					if (this.subTabs.length) {
						if (type == 72) {
							// this.getApplet()
							let _this = this
							this.nowGet = uni.request({
								url: this.portApi + "/baseplatform/applet/notes/list",
								data: {
									pageNum: this.pages.pageNum,
									pageSize: this.pages.pageSize,
									status: 1
								},
								header: {
									"content-type": "application/json;charset=UTF-8",
									Authorization: "Bearer " + uni.getStorageSync("X-Token"),
								},
								method: "GET",
								dataType: "json",
								success: (res) => {
									console.log('进入到新的请求这里了', res)
									this.$nextTick(() => {
										if (res.data.code === 200) {
											_this.texts = res.data.rows
											this.setWaterFallLayout(res.data.rows)
										} else {
											_this.texts = [];
										}
									})

								},
								fail: () => {
									_this.texts = [];
								}
							});
						}
					}
				} else {
					this.subTabs = []
					this.subTabsActId = ''
					//综合推荐
					if (type == 70) {
						let _this = this
						console.log('进入到新的请求这里了111')
						this.nowGet = uni.request({
							url: this.portApi + "/baseplatform/home/reco/data",
							data: {
								pageNum: this.pages.pageNum,
								pageSize: this.pages.pageSize,
							},
							header: {
								"content-type": "application/json;charset=UTF-8",
								Authorization: "Bearer " + uni.getStorageSync("X-Token"),
							},
							method: "GET",
							dataType: "json",
							success: (res) => {
								console.log('进入到新的请求这里了', res)
								this.$nextTick(() => {
									if (res.data.code === 200) {
										_this.texts = res.data.data
										this.setWaterFallLayout(res.data.data)
									} else {
										_this.texts = [];
									}
								})

							},
							fail: () => {
								_this.texts = [];
							}
						});
						// requestGet('/home/reco/data', {
						// 	// ...this.pages
						// }, '/baseplatform').then(res => {
						// 	if (res.code === 200) {
						// 		this.texts = res.rows
						// 		console.log('this.text综合', res)
						// 		this.setWaterFallLayout(res.data)
						// 	}
						// }).catch((err) => console.log('错误了', err))
						//资讯
					} else if (type == 9) {
						let _this = this
						this.nowGet = uni.request({
							url: this.portApi + "/baseplatform/home/content/list",
							data: {
								pageNum: this.pages.pageNum,
								pageSize: this.pages.pageSize,
								channelId: type
							},
							header: {
								"content-type": "application/json;charset=UTF-8",
								Authorization: "Bearer " + uni.getStorageSync("X-Token"),
							},
							method: "GET",
							dataType: "json",
							success: (res) => {
								console.log('进入到新的请求这里了', res)
								this.$nextTick(() => {
									if (res.data.code === 200) {
										_this.texts = res.data.rows
										this.setWaterFallLayout(res.data.rows)
										console.log('获取到新的数据了呢', _this.list)
									} else {
										_this.texts = [];
									}
								})

							},
							fail: () => {
								_this.texts = [];
							}
						});
						// requestGet('/home/content/list', {
						// 	...this.pages,
						// 	channelId: type
						// }, '/baseplatform').then(res => {
						// 	if (res.code === 200) {
						// 		this.texts = res.rows
						// 		console.log('this.text资讯', res)
						// 		this.setWaterFallLayout(res.rows)
						// 	}
						// }).catch((err) => console.log('错误了', err))
					} else if (type == 73) {
						let _this = this
						this.nowGet = uni.request({
							url: this.portApi + "/shop/mobile/goods/list",
							data: {
								pageNum: this.pages.pageNum,
								pageSize: this.pages.pageSize,
							},
							header: {
								"content-type": "application/json;charset=UTF-8",
								Authorization: "Bearer " + uni.getStorageSync("X-Token"),
							},
							method: "GET",
							dataType: "json",
							success: (res) => {
								console.log('进入到新的请求这里了', res)
								this.$nextTick(() => {
									if (res.data.code === 200) {
										_this.texts = res.data.rows
										this.setWaterFallLayout(res.data.rows)
									} else {
										_this.texts = [];
									}
								})

							},
							fail: () => {
								_this.texts = [];
							}
						});
						// requestGet("/mobile/goods/list", this.pages, '/shop').then(res => {
						// 	if (res.code === 200) {
						// 		console.log('获取了文创', res)
						// 		if (res.rows.length > 0) {
						// 			this.setWaterFallLayout(res.rows)
						// 		}
						// 	}
						// })
					} else if (type == 75) {
						let _this = this
						this.nowGet = uni.request({
							url: this.portApi + "/shop/mobile/hotel/list",
							data: {
								pageNum: this.pages.pageNum,
								pageSize: this.pages.pageSize,
							},
							header: {
								"content-type": "application/json;charset=UTF-8",
								Authorization: "Bearer " + uni.getStorageSync("X-Token"),
							},
							method: "GET",
							dataType: "json",
							success: (res) => {
								console.log('进入到新的请求这里了', res)
								this.$nextTick(() => {
									if (res.data.code === 200) {
										_this.texts = res.data.rows
										this.setWaterFallLayout(res.data.rows)
									} else {
										_this.texts = [];
									}
								})

							},
							fail: () => {
								_this.texts = [];
							}
						});
						// requestGet("/mobile/hotel/list", this.pages, '/shop').then(res => {
						// 	if (res.code === 200) {
						// 		console.log('获取了酒店', res)
						// 		if (res.rows.length > 0) {
						// 			this.setWaterFallLayout(res.rows)
						// 		}
						// 	}
						// })
					} else if (type == 74) {
						let _this = this
						this.nowGet = uni.request({
							url: this.portApi + "/shop/mobile/restaurant/list",
							data: {
								pageNum: this.pages.pageNum,
								pageSize: this.pages.pageSize,
							},
							header: {
								"content-type": "application/json;charset=UTF-8",
								Authorization: "Bearer " + uni.getStorageSync("X-Token"),
							},
							method: "GET",
							dataType: "json",
							success: (res) => {
								console.log('进入到新的请求这里了', res)
								this.$nextTick(() => {
									if (res.data.code === 200) {
										_this.texts = res.data.rows
										this.setWaterFallLayout(res.data.rows)
									} else {
										_this.texts = [];
									}
								})

							},
							fail: () => {
								_this.texts = [];
							}
						});
						// requestGet("/mobile/restaurant/list", this.pages, '/shop').then(res => {
						// 	if (res.code === 200) {
						// 		console.log('获取了餐饮', res)
						// 		if (res.rows.length > 0) {
						// 			this.setWaterFallLayout(res.rows)
						// 		}
						// 	}
						// })
					}
				}
			},
			toSpot(item) {
				uni.navigateTo({
					url: '/page_index/attractions/detail?id=' + item.contenId
				})
			},
			toActivity(item) {
				if (item.id) {
					uni.navigateTo({
						url: '/page_index/activity/detail?id=' + item.id
					})
				} else if (item.contenId) {
					uni.navigateTo({
						url: '/page_index/activity/detail?id=' + item.contenId
					})
				}

			},
			goDetail(item) {
				console.log('点击了这些资讯', item)
				if (item.tabType == '1') {
					console.log('是资讯哦')
					uni.navigateTo({
						url: '/page_index/news/detail?id=' + item.id
					})
				} else if (item.tabType == '2') {
					if (item.fileType == '0') {
						//todo
						uni.navigateTo({
							url: '/page_my/travels/detail?id=' + item.id
						})
					} else if (item.fileType == '1') {
						//todo
						uni.navigateTo({
							url: '/page_my/travels/detailVideo?id=' + item.id
						})
					}


				} else if (item.tabType == '3') {
					uni.navigateTo({
						url: '/page_mall/detail/detail?id=' + item.id
					})

				} else if (item.tabType == '4') {
					uni.navigateTo({
						url: '/page_index/restaurant/detail?id=' + item.id
					})

				} else if (item.tabType == '5') {
					uni.navigateTo({
						url: '/page_index/hotel/detail?id=' + item.id
					})

				}
			},
			goScenery() {
				uni.navigateTo({
					url: "/page_index/scenery/list"
				})
			},
			handleToDetail(item) {
				if(item.linkType == 2) {
					uni.navigateToMiniProgram({
						appId: item.appId,
						success: (res) => {
							console.log('跳转小程序成功了', res)
						}
					})
				} else {
					if (item.linkUrl) {
						uni.navigateTo({
							url: item.linkUrl
						})
					} else {
						uni.navigateTo({
							url: this.swiperTopList.contentPath + '?id=' + item.contenId
						})
					}
				}
			},
			hangleJG(item) {
				 if(item.url === "/pages/mall/index"){
				  uni.showToast({title: '此功能暂未开放！', icon: 'none'})
				  return
				}
				if (item.openType === 'navigate') {
					uni.navigateTo({
						url: item.url
					})
				} else if (item.openType === 'switchTab') {
					uni.switchTab({
						url: item.url
					})
				} else if (item.openType === 'webview') {
					console.log('进入到概览详情')
					uni.navigateTo({
						url: '/page_index/introduction/details?id=76'
					})
					// uni.navigateTo({
					// 	url: '/page_index/ticket/list'
					// })
					// uni.navigateToMiniProgram({
					//   appId: 'wxcfe44bbb61ee63cc',
					//   // path: 'pages/index/index',
					//   // extraData: {
					//   //   'data1': 'test'
					//   // },
					//   success(res) {
					//     // 打开成功
					// 	console.log('打开成功')
					//   },
					//   fail(err) {
					// 	  console.log('err', err)
					//   }
					// })
				}

			},
			handleGoNotice(url) {
				console.log('需要跳转到这个url', url)
				uni.navigateTo({
					url: url
				})
			},
			handleToNoticeDet(path, id) {
				uni.navigateTo({
					url: `${path}?id=${id}`
				})
			},
			toPage(url, params = {}) {
				let paramsString = ''
				for (const paramsKey in params) {
					if (!paramsString) {
						paramsString += '?'
					} else {
						paramsString += '&'
					}
					paramsString += `${paramsKey}=${params[paramsKey]}`
				}
				uni.navigateTo({
					url: `${url}${paramsString}`
				})
			},
			changeAct(e) {
				this.actCurrent = e.detail.current
			},
			changeTop(e) {
				this.topCurrent = e.detail.current
			},
			getList(type) {
				console.log('传递过来得', type)
				if (this.nowGet) {
					this.nowGet.abort()
					this.nowGet = null
				}
				this.tabAct = type.type
				this.getTexts(type.type)
			},
			goMore() {
				uni.navigateTo({
					url: '/page_index/information/list'
				})
			},
			async setWaterFallLayout(arr) {
				for (let item of arr) {
					try {
						let h = 0
						if (item.fileType == 0) {
							if (item.imgPath) {
								if (item.tabType == 3 || item.tabType == 4 || item.tabType == 5) {
									h = (await this.getImgHeight(this.imgBasePath + item.imgPath)) * this.columnWidth +
										20
								} else {
									h = (await this.getImgHeight(this.imgBasePath + item.imgPath)) * this.columnWidth +
										40
								}
							} else {
								h = 264
							}
						} else if (item.fileType == 1) {
							h = 440
						}
						// let h = await this.getImgHeight(this.imgBasePath + item.imgPath)
						if (this.leftHeight <= this.rightHeight) {
							this.leftList.push(item)
							this.leftHeight += h
						} else {
							this.rightList.push(item)
							this.rightHeight += h
						}
					} catch (e) {}

				}
			},
			getImgHeight(url) {
				return new Promise((resolve, reject) => {
					uni.getImageInfo({
						src: url,
						success: e => {
							resolve(e.height / e.width)

						},
						fail: e => {
							reject(e)
						}
					})

				})
			}
		},
	};
</script>

<style lang="scss" scoped>
	.index_tit {
		width: 100%;
		height: 148rpx;
		display: flex;
		box-sizing: border-box;
		padding: 0 32rpx;
		// margin-top: 24rpx;
		.tit_lf {
			width: 484rpx;
			box-sizing: border-box;
			padding-left: 8rpx;
			&_top {
				width: 100%;
				height: 52rpx;
				display: block;
				margin: 24rpx 0 20rpx;
			}
			&_bot {
				display: flex;
				align-items: center;
				text {
					font-size: 28rpx;
					font-weight: 400;
					color: #C4F9DF;
					line-height: 40rpx
				}
				image {
					width: 32rpx;
					height: 32rpx;
					display: block;
					margin-left: 8rpx;
				}
			}
		}
		.tit_rt {
			flex: 1;
			display: flex;
			flex-direction: column;
			align-items: flex-end;
			&_top {
				width: 96rpx;
				height: 96rpx;
			}
			&_bot {
				font-size: 28rpx;
				font-weight: 400;
				color: #FFFFFF;
				line-height: 40rpx;
				text {
					margin-left: 16rpx;
				}
			}
		}
	}
	.ad_wrap {
		width: 100%;
		height: 100%;
		position: fixed;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		z-index: 9;
		background: rgba(0, 0, 0, .5);
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;

		.ad_img {
			width: 600rpx;
			height: 640rpx;
			border-radius: 24rpx;
			overflow: hidden;
			margin-bottom: 48rpx;

			image {
				width: 100%;
				height: 100%;
				display: block;
			}
		}

		.close {
			width: 96rpx;
			height: 96rpx;

			image {
				width: 100%;
				height: 100%;
				display: block;
			}
		}

	}

	.tabConWrapNo {
		z-index: 3;
		background: #fff;
		display: flex;
		flex-direction: column;
		overflow: hidden;
		box-sizing: border-box;
		padding: 0 32rpx;
	}

	.tabConWrap {
		width: 100%;
		box-sizing: border-box;
		padding: 0 32rpx;
	}

	.posTabs {
		width: 100%;
		height: calc(100% - 88rpx);
		box-sizing: border-box;
		background: #fff;

		&::-webkit-scrollbar {
			display: none !important;
		}
	}

	.posLoc {
		height: 248rpx;
		width: 100%;
		display: flex;

	}

	.index_wrapper {
		height: 100vh;
		position: relative;
		display: flex;
		flex-direction: column;

		&::-webkit-scrollbar {
			display: none;
		}
	}

	.index_header {
		position: fixed;
		top: 0;
	}

	.index_header_white {
		background: #fff;
		position: fixed;
		top: 0;
		z-index: 2;
	}

	.content {
		background: url('../../static/new/index_bg1.jpg') no-repeat;
		background-repeat: no-repeat;
		background-size: 100% 1034rpx;
		// box-sizing: border-box;
		// padding-left: 32rpx;
		// padding-right: 32rpx;

		&::-webkit-scrollbar {
			display: none;
		}

		.headImg {
			height: 112rpx;
			width: 100%;
			display: block;
			background: transparent;
		}
	}

	.top_swiper {
		position: relative;

		.dots {
			position: absolute;
			bottom: 0;
			width: 100%;
			height: 36rpx;
			display: flex;
			align-items: center;
			justify-content: center;

			.dot_item {
				width: 20rpx;
				height: 4rpx;
				background: rgba(255, 255, 255, 0.6);
				border-radius: 10rpx 10rpx 10rpx 10rpx;
				margin-right: 12rpx;
			}

			.dot_item_active {
				width: 20rpx;
				height: 4rpx;
				border-radius: 10rpx 10rpx 10rpx 10rpx;
				margin-right: 12rpx;
				background: #FFFFFF;
			}
		}
	}

	.hot_act {
		// width: 100vw !important;
		// width: calc(100vw - 40rpx);
		position: relative;

		.act_dots {
			box-sizing: border-box;
			padding-right: 16rpx;
			position: absolute;
			bottom: 0;
			width: 100%;
			height: 36rpx;
			display: flex;
			align-items: center;
			justify-content: flex-end;

			.dot_item {
				width: 20rpx;
				height: 4rpx;
				background: rgba(255, 255, 255, 0.6);
				border-radius: 10rpx 10rpx 10rpx 10rpx;
				margin-right: 12rpx;
			}

			.dot_item_active {
				width: 20rpx;
				height: 4rpx;
				border-radius: 10rpx 10rpx 10rpx 10rpx;
				margin-right: 12rpx;
				background: #FFFFFF;
			}
		}

		.act_top {
			box-sizing: border-box;
			width: 100%;
			display: flex;
			justify-content: space-between;
			align-items: flex-end;
			margin-bottom: 24rpx;

			.top_lf {
				box-sizing: border-box;
				padding: 10rpx 0 0 8rpx;
				font-size: 32rpx;
				line-height: 44rpx;
				font-weight: 700;
				color: rgba(0,0,0,0.9);
				// background: url('https://ltjtjingquguanli.com/statics/std/static/my_icon7.png') no-repeat;
				background-repeat: no-repeat;
				background-size: 100rpx 80rpx;
				background-position: -8rpx -10rpx;
			}

			.top_rt {
				display: flex;
				align-items: center;

				text {
					font-size: 32rpx;
					font-weight: 400;
					color: #87A198;
				}

				image {
					width: 32rpx;
					height: 32rpx;
					display: block;
				}
			}
		}
	}

	.subBan {
		display: flex;
		justify-content: space-between;
		margin-top: 24rpx;
		box-sizing: border-box;
		padding: 0 32rpx;
		
		.title {
			font-size: 32rpx;
			font-weight: 700;
			color: rgba(0, 0, 0, 0.8);
		}

		.sub_title {
			font-size: 24rpx;
			font-weight: 400;
			color: rgba(0, 0, 0, 0.5);
			line-height: 32rpx;
		}

		.sub_lt,
		.sub_rt {
			width: calc((100% - 22rpx) / 2);

			image {
				width: 40rpx;
				height: 40rpx;
				display: block;
			}
			
			text {
				font-size: 24rpx;
				font-weight: 400;
				color: rgba(0,0,0,0.5);
				line-height: 32rpx;
			}
		}

		.sub_lt {
			height: 332rpx;
			background: linear-gradient(118deg, rgba(210, 231, 255, 0.95) 12%, rgba(220, 232, 255, 0.44) 100%);
			border-radius: 24rpx;
			overflow: hidden;

			.sub_lt_bg {
				display: flex;
				flex-direction: column;
				width: 100%;
				height: 100%;
				box-sizing: border-box;
				padding: 24rpx 0 0 32rpx;
				//background: url('https://ltjtjingquguanli.com/statics/std/static/sub_1.png') no-repeat no-repeat 0 0;
				background-repeat: no-repeat;
				background-origin: 0 0;
				background-size: 100% 100%;
				&_top {
					height: 48rpx;
					display: flex;
					align-items: center;
					margin-bottom: 8rpx;
					image:nth-of-type(1) {
						width: 144rpx;
						height: 48rpx;
						display: block;
						margin-right: 8rpx;
					}
					image:nth-of-type(2) {
						width: 40rpx;
						height: 40rpx;
						display: block;
					}
				}
			}
		}

		.sub_rt {

			.rt_top,
			.rt_bot {

				width: 100%;
				height: 156rpx;
				background: linear-gradient(88deg, rgba(255, 229, 189, 0.86) 0%, #FFF6E4 100%);
				border-radius: 24rpx 24rpx 24rpx 24rpx;
				overflow: hidden;
			}

			.rt_bot {
				background: linear-gradient(270deg, rgba(201, 243, 228, 0.79) 0%, #EAFAFA 100%);
				border-radius: 24rpx;
				margin-top: 20rpx;
			}

			.rt_bot_bg {
				display: flex;
				flex-direction: column;
				width: 100%;
				height: 100%;
				box-sizing: border-box;
				padding: 24rpx 0 0 32rpx;
				//background: url('https://ltjtjingquguanli.com/statics/std/static/sub_3.png') no-repeat;
				background-repeat: no-repeat;
				background-size: 100% 100%;
				margin-bottom: 14rpx;
				&_top {
					height: 48rpx;
					display: flex;
					align-items: center;
					margin-bottom: 8rpx;
					image:nth-of-type(1) {
						width: 144rpx;
						height: 48rpx;
						display: block;
						margin-right: 8rpx;
					}
					image:nth-of-type(2) {
						width: 40rpx;
						height: 40rpx;
						display: block;
					}
				}
			}

			.rt_top_bg {
				display: flex;
				flex-direction: column;
				width: 100%;
				height: 100%;
				box-sizing: border-box;
				padding: 24rpx 0 0 32rpx;
				//background: url('https://ltjtjingquguanli.com/statics/std/static/sub_2.png') no-repeat;
				background-repeat: no-repeat;
				background-size: 100% 100%;
				&_top {
					height: 48rpx;
					display: flex;
					align-items: center;
					margin-top: 8rpx;
					image:nth-of-type(1) {
						width: 144rpx;
						height: 48rpx;
						display: block;
						margin-right: 8rpx;
					}
					image:nth-of-type(2) {
						width: 40rpx;
						height: 40rpx;
						display: block;
					}
				}

			}

			.rt_top_l {
				height: 100%;
				display: flex;
				flex-direction: column;
				justify-content: space-between;
			}
		}
	}

	.jg {
		width: calc(100% - 64rpx);
		height: 176rpx;
		margin-left: 32rpx;
		border-radius: 0 0 24rpx 24rpx;
			box-sizing: border-box;
			padding: 20rpx 0 28rpx;
			display: flex;
			justify-content: space-between;
			background: #fff;
	
			.jg_item {
				width: 144rpx;
				display: flex;
				flex-direction: column;
				align-items: center;
	
				image {
					width: 96rpx;
					height: 96rpx;
					display: block;
					// margin-bottom: 16rpx;
				}
	
				text {
					font-size: 26rpx;
					font-weight: 400;
					color: #5F6F86;
					// line-height: 30rpx;
				}
			}
		}


	.swiper {
		height: 300rpx;
		width: 100%;
		border-radius: 24rpx;
		overflow: hidden;

		.swiper-item {
			display: block;
			height: 100%;
			width: 100%;
			line-height: 300rpx;
			text-align: center;
			border-radius: 24rpx;
			overflow: hidden;

			image {
				height: 100%;
				width: 100%;
				display: block;
			}
		}
	}

	.spot_swiper {
		height: 408rpx;
		// width: calc(100vw - 40rpx);
		width: 100%;

		image {
			height: 100%;
			width: 100%;
		}
		swiper-item {
			width: calc(100vw - 48rpx) !important;
			display: flex;
			justify-content: center;
		}

		.spot_swiper-item {
			display: block;
			height: calc(100% - 48rpx);
			width: calc(100% - 16rpx);
			line-height: 400rpx;
			text-align: center;
			position: relative;
			border-radius: 24rpx;
			overflow: hidden;
			box-shadow: 0px 12rpx 24rpx 0px rgba(0, 0, 0, 0.15);

			.spot_intr {
				position: absolute;
				bottom: 0;
				width: 100%;
				height: 112rpx;
				background: rgba(255,255,255,0.8);
				border-radius: 24rpx 24rpx 0 0;
				box-sizing: border-box;
				padding: 0 0 0 24rpx;
				display: flex;
				align-items: center;
				justify-content: space-between;

				.intr_lf {
					width: 440rpx;
					overflow: hidden; //溢出隐藏
					text-overflow: ellipsis; //省略号
					white-space: nowrap; //强制文本不换行
					font-size: 32rpx;
					font-weight: 700;
					color: #FFFFFF;
					line-height: 48rpx;
					text-align: left;
					&_top {
						font-size: 32rpx;
						font-weight: 600;
						color: rgba(0,0,0,0.7);
						line-height: 44rpx;
					}
					&_bot {
						display: flex;
						align-items: center;
						text {
							font-size: 24rpx;
							font-weight: 400;
							color: #3FAA73;
							line-height: 32rpx;
						}
						image {
							width: 32rpx;
							height: 32rpx;
							display: block;
							margin-left: 8rpx;
						}
					}
				}

				.intr_rt {
					height: 100%;
					display: flex;
					align-items: center;

					view{
						width: 114rpx;
						height: 64rpx;
						box-sizing: border-box;
						padding: 0 32rpx;
						font-size: 24rpx;
						font-weight: 400;
						color: rgba(0,0,0,0.7);
						line-height: 32rpx;
						border-left: 2rpx solid rgba(0,0,0,0.1)
					}
				}
			}


		}
	}

	.act_swiper {
		height: 520rpx;
		width: calc(100vw - 32rpx);
		swiper-item {
			width: calc(100vw - 288rpx) !important;
		}

		.act_swiper-item {
			border-radius: 24rpx;
			display: block;
			height: 100%;
			width: calc(100% - 24rpx);
			// width: 100%;
			line-height: 172rpx;
			text-align: center;
			overflow: hidden;
			position: relative;
			

			image {
				height: 100%;
				width: 100%;
				display: block;
			}
			
			.act_intr {
				position: absolute;
				bottom: 0;
				width: 100%;
				height: 112rpx;
				background: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0.5) 100%);
				box-sizing: border-box;
				padding: 0 24rpx 16rpx;
				display: flex;
				align-items: flex-end;
				justify-content: space-between;

				.intr_lf{
					width: 100%;
					overflow: hidden; //溢出隐藏
					text-overflow: ellipsis; //省略号
					white-space: nowrap; //强制文本不换行
					font-size: 32rpx;
					font-weight: 700;
					color: #FFFFFF;
					line-height: 48rpx;
					text-align: left;
					&_top {
						font-size: 28rpx;
						font-weight: 600;
						color: #FFFFFF;
						line-height: 44rpx;
					}
					&_bot {
						display: flex;
						align-items: center;
						text {
							font-size: 24rpx;
							font-weight: 400;
							color: rgba(255,255,255,0.8);
							line-height: 40rpx;
						}
						image {
							width: 24rpx;
							height: 24rpx;
							display: block;
							margin-right: 8rpx;
						}
					}
				}

				.intr_rt {
					height: 100%;
					display: flex;
					align-items: center;

					view{
						width: 114rpx;
						height: 64rpx;
						box-sizing: border-box;
						padding: 0 32rpx;
						font-size: 24rpx;
						font-weight: 400;
						color: rgba(0,0,0,0.7);
						line-height: 32rpx;
						border-left: 2rpx solid rgba(0,0,0,0.1)
					}
				}
			}
		}
	}



	.notices {
		width: calc(100% - 64rpx);
		margin-left: 32rpx;
		height: 72rpx;
		background: linear-gradient(180deg, rgba(255,255,255,0.8) 0%, #FFFFFF 32%, #FFFFFF 100%);
		box-shadow: 0rpx 12rpx 24rpx 0rpx rgba(13,106,35,0.2);
		border-radius: 24rpx 24rpx 0 0;
		border-bottom: 2rpx solid rgba(0,0,0,0.05);
		display: flex;
		align-items: center;
		box-sizing: border-box;
		padding: 0 16rpx 0 24rpx;
		margin-top: 70rpx;

		.notice_swiper {
			width: calc(100% - 64rpx);
			height: 100%;

			.notice_swiper-item {
				display: block;
				height: 100%;
				width: 100%;
				line-height: 70rpx;
				text-align: left;

				text {
					width: 100%;
					font-size: 28rpx;
					// line-height: 72rpx;
					font-weight: 400;
					color: rgba(0, 0, 0, 0.7);
					overflow: hidden; //溢出隐藏
					text-overflow: ellipsis; //省略号
					white-space: nowrap; //强制文本不换行
				}
			}
		}

		image {
			width: 32rpx;
			height: 32rpx;
			display: block;
		}

		// .go {
		// 	width: 32rpx;
		// 	height: 32rpx;
		// }

		text {
			width: calc(100% - 90rpx);
			font-size: 24rpx;
			line-height: 32rpx;
			font-weight: 400;
			color: rgba(0, 0, 0, 0.7);
			overflow: hidden; //溢出隐藏
			text-overflow: ellipsis; //省略号
			white-space: nowrap; //强制文本不换行
			margin-left: 24rpx;
		}
	}

	.num {
		font-family: 'D-DIN-Bold';
	}

	.tab {
		width: 100%;
		// height: 100rpx;
		margin-bottom: 16rpx;
		// margin-top: 48rpx;
		// box-sizing: border-box;
		// padding: 0 24rpx 0 40rpx ;
	}

	.tabCon {
		width: 100%;
		overflow-x: scroll;
		margin-bottom: 8rpx;
		box-sizing: border-box;

		&::-webkit-scrollbar {
			display: none;
		}

		.sub {
			display: flex;
			flex-wrap: nowrap;
			margin-bottom: 16rpx;

			.item_act {
				display: flex;
				align-items: center;
				justify-content: center;
				height: 48rpx;
				box-sizing: border-box;
				padding: 8rpx 16rpx;
				background: #2187FF;
				border-radius: 8rpx 8rpx 8rpx 8rpx;
				font-size: 24rpx;
				font-weight: 400;
				color: #FFFFFF;
				margin-right: 16rpx;
				white-space: nowrap;
			}

			.item {
				display: flex;
				align-items: center;
				justify-content: center;
				height: 48rpx;
				box-sizing: border-box;
				padding: 8rpx 16rpx;
				background: rgba(77, 134, 247, 0.102);
				border-radius: 8rpx 8rpx 8rpx 8rpx;
				font-size: 24rpx;
				font-weight: 400;
				color: #5F6F86;
				margin-right: 16rpx;
				white-space: nowrap;
			}
		}
	}

	.page_wrap {
		// height: calc(100vh - 250rpx);
		flex: 1;
		z-index: 99;

		// overflow: scroll;
		&::-webkit-scrollbar {
			display: none !important;
		}
	}

	.page_wrap_sub {
		height: calc(100vh - 250rpx - 100rpx);
		background: pink;
	}

	.page {
		width: 100%;
		height: 100%;
		// overflow: hidden;
		display: flex;
		align-items: flex-start;
		box-sizing: border-box;

		&::-webkit-scrollbar {
			display: none !important;
		}

		.left,
		.right {
			width: calc((100% - 22rpx) / 2);
		}
		
		.left {
			margin-right: 22rpx;
		}

		.mar_bot24 {
			margin-bottom: 24rpx;
		}

		.mar_bot48 {
			margin-bottom: 48rpx;
		}

		.zx_t {
			font-size: 24rpx;
			font-weight: 400;
			color: #2187FF;
			line-height: 32rpx;
		}

		.no_img {
			width: 100%;
			height: 264rpx;
			background: #ECEFF1;
			border-radius: 24rpx;
			box-sizing: border-box;
			padding: 24rpx;
			margin-bottom: 24rpx;

			.zx {
				width: 100%;
				height: 160rpx;
				overflow: hidden;
				text-overflow: ellipsis;
				display: -webkit-box;
				-webkit-line-clamp: 4;
				-webkit-box-orient: vertical;
				white-space: normal;
			}
		}

		.video_wrap {
			width: 100%;
			height: 440rpx;
			display: flex;
			flex-direction: column;
			border-radius: 24rpx;
			overflow: hidden;
			position: relative;
			margin-bottom: 24rpx;

			.play {
				width: 64rpx;
				height: 64rpx;
				position: absolute;
				top: 24rpx;
				right: 24rpx;
				z-index: 99;

			}
		}

		.video_det {
			width: 100%;
			height: 122rpx;
			position: absolute;
			bottom: 0;
			display: flex;
			flex-direction: column;

			.video_per {
				height: 72rpx;
				display: flex;
				justify-content: space-between;
				align-items: center;
				margin-top: 8rpx;
				box-sizing: border-box;
				padding: 0 16rpx;
				background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.6) 100%);

				.video_per_lf {
					display: flex;
					align-items: center;

					image {
						width: 32rpx;
						height: 32rpx;
            border-radius: 16rpx;
						display: block;
						margin-right: 12rpx;
					}

					text {
						font-size: 24rpx;
						font-weight: 400;
						color: #FFFFFF;
						margin-right: 8rpx;
					}
				}

				.video_per_rt {
					display: flex;
					align-items: center;

					image {
						width: 24rpx;
						height: 24rpx;
						display: block;
						margin-right: 8rpx;
					}

					text {
						font-size: 24rpx;
						font-weight: 400;
						color: #87A198;
						line-height: 32rpx;
					}
				}
			}

			.video_loc_wrap {
				height: 42rpx;
				display: flex;
        align-items: center;
			}

			.video_loc {
        width: 70%;
				display: flex;
				align-items: center;
        justify-content: flex-start;
				background: rgba(0, 0, 0, 0.4);
				border-radius: 24rpx 24rpx 24rpx 24rpx;
				box-sizing: border-box;
				padding: 4rpx 16rpx 4rpx 12rpx;

				image {
					width: 24rpx;
					height: 24rpx;
					display: block;
					margin-right: 8rpx;
          flex: 0 0 auto;
				}

				text {
					font-size: 24rpx;
					font-weight: 400;
					color: #FFFFFF;
					line-height: 34rpx;
          display: -webkit-box;
          -webkit-line-clamp: 1;
          /* 控制最多显示两行 */
          -webkit-box-orient: vertical;
          overflow: hidden;
          text-overflow: ellipsis;
				}
			}

		}

		.video {
			width: 100%;
			height: 100%;
		}

		.image {
			width: 100%;
			height: auto;
			margin-bottom: 16rpx;
			border-radius: 24rpx;
		}

		.title {
			width: 100%;
			height: 40rpx;
			font-size: 28rpx;
			font-weight: 700;
			color: rgba(0, 0, 0, 0.7);
			line-height: 40rpx;
			overflow: hidden; //溢出隐藏
			text-overflow: ellipsis; //省略号
			white-space: nowrap; //强制文本不换行
		}

		.info {
			width: 100%;
			height: 200rpx;
			background-color: #55aa7f;
		}

		.per {
			display: flex;
			justify-content: space-between;
			align-items: center;
			margin-top: 24rpx;
			margin-bottom: 48rpx;

			.per_lf {
				display: flex;
				align-items: center;

				image {
					width: 32rpx;
					height: 32rpx;
          border-radius: 16rpx;
					display: block;
					margin-right: 8rpx;
				}

				text {
					font-size: 24rpx;
					font-weight: 400;
					color: rgba(0, 0, 0, 0.8);
					line-height: 32rpx;
					margin-right: 8rpx;
				}
			}

			.per_rt {
				display: flex;
				align-items: center;

				image {
					width: 24rpx;
					height: 24rpx;
					display: block;
					margin-right: 8rpx;
				}

				text {
					font-size: 24rpx;
					font-weight: 400;
					color: #777F8F;
					line-height: 32rpx;
				}
			}
		}
	}
</style>